import React from 'react'
import styles from './ProductImage.module.css'
import { Typography, Image } from 'antd'

interface PropsType {
    id: number | string,
    size: 'large' | 'small',
    imageSrc: string,
    title: string,
    price: number | string
}

const ProductImage: React.FC<PropsType> = ({ id, size, imageSrc, title, price }) => {
    return (
        <div >
            {size == "large" ? (
                <Image src={imageSrc} height={285} width={490} />
            ) : (
                <Image src={imageSrc} height={120} width={240} />
            )}
            <div>
                <Typography.Text type="secondary">
                    {title.slice(0, 25)}
                </Typography.Text>
                <Typography.Text type="danger" strong>
                    ¥ {price} 起
                </Typography.Text>
            </div>
        </div>
    )
}

export default ProductImage